import {onBeforeUnmount, onMounted, reactive, ref} from 'vue'

export default function useTheme() {
    // dark 开启全局深色
    const theme = ref('')

    // 定制主题
    const themeVars = reactive({
        // primaryColor: "#999",
        // primaryColorEnd: '#008000',
        gridItemContentPadding:'5px 8px',
        tabsTitlesItemActiveColor:'red',
        dividerTextFontSize:'0.1px',
        dividerLineHeight:'.5px',
        dividerTextColor:'grey',
        menuBarLineHeight:'30px',

        pageBackgroundColor: '#f2f2f2',
        pagePadding: '10px',
        placeHolderColor:'#b8b8b8'
    })

    onMounted(() => {
        console.log("useTheme：---onMounted---")

    })
    onBeforeUnmount(() => {
        console.log("useTheme：---onBeforeUnmount---")

    })
    return{
        theme,
        themeVars,
    }

}